<div class = "main-view"><!--最外层div-->
    <div class="left-margin top-margin"><strong class="am-text-primary am-text-lg">专题管理</strong></div>


    <form class="am-form-inline left-margin top-margin" role="form">
        <div class="am-form-group">
            <label class="left-margin">标题:</label> <input type="text" class="modal-input" style="height: 30px" ng-model="desc">
        </div>
        <button type="submit" class="am-btn am-btn-primary" ng-click="search()" data-target = "cascad-search">搜索</button>
    </form>
    <br>


    <div class="am-btn-group am-btn-group-xs left-margin top-margin">
        <button type="button" class="am-btn am-btn-default" data-am-modal="{target: '#doc-modal-add', width: 1200, height: 800}"><span class="am-icon-plus"></span> 添加专题</button>
        <!--<button type="button" class="am-btn am-btn-default" ng-click="delete()"><span class="am-icon-trash-o"></span> 删除</button>-->
    </div>


    <div id = "pagination" class = "pagination"></div>
    <div class="pagination-table left-margin" id="tab_menu" style = "margin-top: 0px;">
        <form class="am-form">
            <table class="am-table am-table-striped am-table-hover table-main">
                <thead>
                <tr>
                    <th class="table-check"><input type="checkbox" ng-click="allSelected()"></th>
                    <th class="table-id">专题ID</th>
                    <th class="table-title">标题</th>
                    <th class="table-title">URL</th>
                    <th class="table-title">创建时间</th>
                    <th class="table-title">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="topic in topicList" id="{{topic.objId}}">
                    <td class="table-check"><input type="checkbox" class="item-check"></td>
                    <td>{{topic.objId}}</td>
                    <td>{{topic.title}}</td>
                    <td>{{topic.url}}</td>
                    <td>{{topic.dateCreated | date:'yyyy-MM-dd HH:mm:ss'}}</td>

                    <td>
                        <button class="am-btn am-btn-default am-btn-xs am-text-secondary" ng-click="openEdit(topic)"><span class="am-icon-pencil-square-o"></span> 编辑</button>
                        <button data-am-modal="{target: '#code-modal', width: 300, height: 300}" class="am-btn am-btn-default am-btn-xs " ng-click="previewTopic(topic.url)"><span class="am-icon-copy"></span> 预览</button>
                        <button ng-show="!topic.isValid" ng-click="handleRelease(topic, $index, true)" class="am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-pencil-square-o"></span> 发布</button>
                        <button ng-show="topic.isValid" data-am-modal="{target:'#cancel-confirm-{{$index}}'}" class="am-btn am-btn-default am-btn-xs am-text-danger"><span class="am-icon-pencil-square-o"></span> 取消发布</button>
                        <button data-am-modal="{target:'#delete-confirm-{{$index}}'}" class="am-btn am-btn-default am-btn-xs am-text-danger"><span class="am-icon-trash-o"></span> 删除</button>



                        <!--编辑 -->
                        <!--<div class="am-modal am-modal-no-btn" id="doc-modal-edit-{{$index}}">-->
                            <!--<div class="am-modal-dialog">-->
                                <!--<div class="am-modal-hd border-bottom" style = "text-align: left;">编辑专题-->
                                    <!--<a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>-->
                                <!--</div>-->
                                <!--<div class="am-modal-bd body-area">-->
                                    <!--<div style = "width:80%" class = "text-left">-->
                                        <!--<form class="am-form-inline">-->

                                            <!--<label>专题标题</label><input type="text" class="am-form-field" ng-model="topic.title" required style="width:50%;"><br>-->
                                            <!--<label>内容简介</label><input type="text" class="am-form-field" ng-model="topic.summary" required style="width:50%;"><br>-->

                                            <!--&lt;!&ndash;<div><label>壁纸</label>&ndash;&gt;-->
                                                <!--&lt;!&ndash;<input type="file" onchange="angular.element(this).scope().selectFile(this.files, 'backImg')" accept="image/*">&ndash;&gt;-->
                                            <!--&lt;!&ndash;</div><br><br>&ndash;&gt;-->
                                            <!--<div>-->
                                                <!--<slide>-->
                                                    <!--<img ng-src="{{topic.imageURL}}" style="width: 100px;" onclick="if($(this).width()==100){-->
                                                    <!--$('img').width(100);-->
                                                    <!--$(this).width(360);-->
                                                    <!--}else{-->
                                                    <!--$(this).width(100);-->
                                                    <!--};">-->
                                                <!--</slide>-->
                                            <!--</div>-->
                                            <!--<br>-->

                                            <!--<div><label>分享图标(120*120)</label>-->
                                                <!--<input type="file" id="images_upload_edit-{{$index}}" onchange="angular.element(this).scope().selectFile(this.files,'edit',$index)" accept="image/*">-->
                                            <!--</div>-->

                                            <!--<div id="image_result_edit" class="image-result"></div>-->

                                            <!--<br><br>-->

                                            <!--<label>内容</label><textarea id="editor_edit-{{$index}}" name="content" ng-model='topic.desc' style="width:80%;height:500px;"></textarea><br>-->
                                        <!--</form>-->
                                    <!--</div>-->

                                <!--</div>-->
                                <!--<div class = "button-area border-top">-->
                                    <!--<button ng-click="clearEditor()" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-danger"><span class="am-icon-trash-o"></span>清空</button>-->
                                    <!--<button ng-click="handleTopic(topic, true, $index)" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-plus"></span>更新专题</button>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</div>-->


                        <!--取消发布-->
                        <div class="am-modal am-modal-confirm" id="cancel-confirm-{{$index}}">
                            <div class="am-modal-dialog">
                                <div class="am-modal-hd">取消发布</div>
                                <div class="am-modal-bd">确定要取消发布该专题吗？</div>
                                <div class="am-modal-footer">
                                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                                    <span ng-click="handleRelease(topic, $index, false)" class="am-modal-btn" data-am-modal-confirm>确定</span>
                                </div>
                            </div>
                        </div>


                        <!--删除-->
                        <div class="am-modal am-modal-confirm" id="delete-confirm-{{$index}}">
                            <div class="am-modal-dialog">
                                <div class="am-modal-hd">删除专题</div>
                                <div class="am-modal-bd">确定要取消删除该专题吗？</div>
                                <div class="am-modal-footer">
                                    <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                                    <span ng-click="delete(topic, $index)" class="am-modal-btn" data-am-modal-confirm>确定</span>
                                </div>
                            </div>
                        </div>

                    </td>


                </tr>
                </tbody>
            </table>
        </form>
    </div>

    <div class = "left-margin">共<span id = 'page_number'>{{pageNumber}}</span>页 <span>{{count}}条数据</span></div>



    <!--预览-->
    <div class="am-modal am-modal-confirm" id="code-modal"><div id="code"></div></div>


    <!--新增 -->
    <div class="am-modal am-modal-no-btn" id="doc-modal-add">
        <div class="am-modal-dialog">
            <div class="am-modal-hd border-bottom" style = "text-align: left;">添加专题
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd body-area">
                <div style = "width:80%" class = "text-left">
                    <form class="am-form-inline">

                        <label>专题标题</label><input type="text" class="am-form-field" ng-model="topic.title" required style="width:50%;"><br>
                        <label>内容简介</label><input type="text" class="am-form-field" ng-model="topic.summary" required style="width:50%;"><br>

                        <label>分享描述</label><input type="text" class="am-form-field" ng-model="topic.shareDesc" required style="width:50%;"><br>
                        <!--<div><label>壁纸</label>-->
                            <!--<input type="file" onchange="angular.element(this).scope().selectFile(this.files, 'backImg')" accept="image/*">-->
                        <!--</div><br><br>-->


                        <div><label>分享图标(120*120)</label>
                            <input type="file" id="images_upload" onchange="angular.element(this).scope().selectFile(this.files, 'add')" accept="image/*">
                            <div id="image_result" class="image-result"></div>
                        </div>

                        <br><br>

                        <label>内容</label><textarea id="editor_id" name="content" ng-model='topic.desc' style="width:80%;height:500px;"></textarea><br>
                    </form>
                </div>

            </div>
            <div class = "button-area border-top">
                <button ng-click="clearEditor()" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-danger"><span class="am-icon-trash-o"></span>清空</button>
                <button ng-click="handleTopic(topic, false)" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-plus"></span>添加专题</button>
            </div>
        </div>
    </div>

    <!--编辑框 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="doc-modal-edit">
        <div class="am-modal-dialog">
            <div class="am-modal-hd border-bottom" style = "text-align: left;">编辑专题
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div style="position:absolute; left:10%; right:10%;">
                <div class="am-modal-bd body-area text-left">
                    <div style = "width:80%" class = "text-left">
                        <form class="am-form-inline">

                            <label>专题标题</label><input type="text" class="am-form-field" ng-model="updateData.title" required style="width:50%;"><br>
                            <label>内容简介</label><input type="text" class="am-form-field" ng-model="updateData.summary" required style="width:80%;"><br>
                            <label>分享描述</label><input type="text" class="am-form-field" ng-model="updateData.shareDesc" required style="width:80%;"><br>
                            <!--<div><label>壁纸</label>-->
                            <!--<input type="file" onchange="angular.element(this).scope().selectFile(this.files, 'backImg')" accept="image/*">-->
                            <!--</div><br><br>-->
                            <div>
                                <slide>
                                    <img ng-src="{{updateData.imageURL}}" style="width: 100px;" onclick="if($(this).width()==100){
                                                    $('img').width(100);
                                                    $(this).width(360);
                                                    }else{
                                                    $(this).width(100);
                                                    };">
                                </slide>
                            </div>
                            <br>

                            <div><label>分享图标(120*120)</label>
                                <input type="file" id="images_upload_edit" onchange="angular.element(this).scope().selectFile(this.files,'edit')" accept="image/*">
                            </div>

                            <div id="image_result_edit" class="image-result"></div>

                            <br><br>

                            <label>内容</label><textarea id="editor_edit" name="content" ng-model='updateData.desc' style="width:80%;height:500px;"></textarea><br>
                        </form>
                    </div>
                    <div class = "button-area border-top">
                        <button ng-click="clearEditor()" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-danger"><span class="am-icon-trash-o"></span>清空</button>
                        <button ng-click="handleTopic(updateData, true)" class="right-margin top-margin am-btn am-btn-default am-btn-xs am-text-secondary"><span class="am-icon-plus"></span>更新专题</button>
                    </div>
                </div>
            </div>

        </div>
    </div>


</div>





